<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<title>文字的行高</title>

	<style>
		
		p{

			color: red;
			/* line-height: 如何设置呢？ */

			font-size: 16px;

			/* 建议设置为当前字体的 1.2-1.5 之间 很好的展示，实际还是以设计稿*/
			/*line-height: 24px; */
			/* 文字的行高可以写像素，也可以写 百分比 相当于当前文字的大小 * 当前 N% 也可以写 em*/
			/*line-height: 200%;  */
			/*32*/
			line-height: 1.2em;

			text-align: center;

			/* 如果是单行文字，文字在自己的行高里面是 垂直居中的*/
			/*水平居中*/

			border: 1px solid black;

			/* 作业： 如果让多行文字信息出现：垂直 水平居中*/

		}

	</style>

</head>
<body>
	<h2>文字的行高</h2>
	<p>文字的行高：文字在一行里面的高度。 其主要的作用就是为了美观。</p>

</body>
</html>